<!---->
<template>
<el-form :model="categroyValidateForm" ref="categroyValidateForm" label-width="100px" class="demo-ruleForm">
  <el-form-item
    label="分类"
    prop="categroy"
    :rules="[
      { required: true, message: '分类不能为空'}
    ]"
  >
    <el-input v-model.number="categroyValidateForm.categroy" autocomplete="off" clearable></el-input>
  </el-form-item>
  <el-form-item>
    <el-button type="primary" @click="submitForm('categroyValidateForm')">提交</el-button>
    <el-button @click="resetForm('categroyValidateForm')">重置</el-button>
  </el-form-item>
</el-form>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import<组件名字> from '<组件路径>';

export default {
//import引入的组件需要注入对象中才能用
components:{},
data() {
return {
 categroyValidateForm: {
          categroy: ''
        }
};
},
//监听属性 类似于data概念
computed: {},
//监控data中的数据变化
watch: {},
//方法集合
methods: {
submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
            this.API.addCategory(this.categroyValidateForm).then(res=>{
              if(res.message.code == 200){
                this.$message({
                  message:res.message.msg,
                  type: 'success'
                })
              }else{
                this.$message.error(res.message.msg)
              }
            })
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      }
},
//生命周期 - 创建完成（可以访问当前this实例）
created() {

},
//生命周期-挂载完成（可以访问DOM元素）
mounted() {

},
beforeCreate() {},//生命周期-创建之前
beforeMount() {},//生命周期-挂载之前
beforeUpdate() {},//生命周期-更新之前
updated() {},//生命周期-更新之后
beforeDestroy() {},//生命周期-销毁之前
destroyed() {},//生命周期-销毁完成
activated() {},//如果页面有keep-alive缓存功能，这个会输会触发
}
</script>
<style lang='less' scoped>
//@import url(); 引入公共css类
</style>